<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> </title>
 
<style type="text/css">
  body {
    margin: 0;
    padding: 0;
    background: #80BDCB;
    cursor: E-resize;
  }
</style>
<script type="text/javascript" src="../js/utils.js" ></script>
<script type="text/javascript" language="JavaScript">
<!--
var pic = new Image();
pic.src="images/arrow_right.gif";

function toggleMenu()
{
    frmBody = parent.document.getElementById('frame-body');
    imgArrow = document.getElementById('img');

    if (frmBody.cols == "0, 10, *")
    {
        frmBody.cols="200, 10, *";
        imgArrow.src = "images/arrow_left.gif";
    }
    else
    {
        frmBody.cols="0, 10, *";
        imgArrow.src = "images/arrow_right.gif";
    }
}

var orgX = 0;
document.onmousedown = function(e)
{
    var evt = Utils.fixEvent(e);
    orgX = evt.clientX;
    
    if (Browser.isIE) document.getElementById('tbl').setCapture();
}

document.onmouseup = function(e)
{
    var evt = Utils.fixEvent(e);

    frmBody = parent.document.getElementById('frame-body');
    frmWidth = frmBody.cols.substr(0, frmBody.cols.indexOf(','));
    frmWidth = (parseInt(frmWidth) + (evt.clientX - orgX));

    frmBody.cols = frmWidth + ", 10, *";

    if (Browser.isIE) document.releaseCapture();
}
//-->
</script>
 
</head>

<body onselect="return false;">
<table height="100%" cellspacing="0" cellpadding="0" id="tbl">
<tr><td>
  <a href="javascript:toggleMenu();"><img src="images/arrow_left.gif" width="10" height="30" id="img" border="0" /></a>
</td></tr></table>
</body>

</html>
